import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
  import App from './App';

// var name = 'jack'

// var obj = {
//   id: 1, 
//   name: 'rose'
// }
// var h1=<h1>我是一个h1标签</h1>

/* 
var  lis=(<li></li>)
var title = (<div>我是一个h1
  <span className='spans'>我是一个span标签=={name}==={obj.name}==={obj.id}==={h1}=={1>2?'true':'false'}</span>
</div>)

ReactDOM.render(
  title,
  document.getElementById('root')
);



 */
// var arr = [
//   { id: 1, name: 'jack' },
//   { id: 2, name: 'jack2' },
//   { id: 3 },
//   { id: 4, name: 'jack4' },
// ]

//  var  uls=(
//  <ul>{arr.map(item=><li key={item.id}>{item.name}</li>)}</ul>
//  )

// ReactDOM.render(
//   uls,
//   document.getElementById('root')
// );

//  创建一个函数组件
// function  Hello  (){
//   return  (<div>我是一个函数组件</div>)
// }


// ReactDOM.render(
//   <Hello/>,
//   document.getElementById('root')
// );

// class  Hello  extends React.Component{
//   render(){
//     return (<div>我是一个类组件</div>)
//   }
// }


ReactDOM.render(
  <App/>,
  document.getElementById('root')
);